<!DOCTYPE html>
<html lang="zh-CN"> 
<head>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
<meta charset="utf-8"/>
<title>美站库 炫美网站大全</title>
<link rel="stylesheet" type="text/css" href="images/index.css">
<link rel="stylesheet" href="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.css">
  
  <script src="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<div id="header">
     <div id="top" class="auto">
	 <div class="logo">
	      <h1>
		  <img src="images/logo.png"/>
	      <span>炫美网站大全<span>
		  </h1>
	</div>
	 <div  class="search">
	 <form>
	     <input id ="dioText" class="text" type="text"/>
	     <input id="dioButton" class="submit" type="button" value="搜索"/>
	 </form>
	 </div>
	</div>
     <div id="nav" class="auto">
	 <ul>
	    <li><a href="#">首页</a></li>
		<li><a href="#">提交站点</a></li>
	 </ul>
	 </div>
	 <div id="runplay" class="auto">
	 <div class="left">
	 <a href="#"><img src="images/img1.jpg"/></a>
	 </div>
	 <div class="right">
	 <dl>
	 <dt>炫美网站，尽在美站库</dt>
	 <dd class="txt">本网站收集互联网上各种炫美网站......</dd>
	 <dd class="btn">
	 <a href="#">查看更多</a>
	 </dd>
	 </dl>
	 </div>
	 </div>
</div>
<div id="main">
<div id="main1">
<div id="wrap">
 <div id="leftBody">
 <div class="leftDiv1">
 <h2>搜索库</h2>
 <p>美站库是<a href="https://www.bilibili.com/" target="_blank">私房库</a>视频html课程中的第一个项目实战课！</p>
 </div>
 <div class="leftDiv2">
  <h2>宇宙最强搜索（低仿山寨打折阉割破解版）</h2>
  <ul>
  <li>
  <a href="#"><img src="images/timg (1).jpg" height="135px" /></a>
  <p>朝花夕逝</p>
  </li>
  <li>
  <a href="#"><img src="images/2.jpg"height="135px" /></a>
  <p>白蛇：缘起</p>
  </li>
  <li>
  <a href="#"><img src="images/3.jpg"height="135px"/></a>
  <p>jojo的奇妙冒险不灭钻石</p>
  </li>
  <li>
  <a href="#"><img src="images/4.jpg"height="135px"/></a>
  <p>假面骑士平成世代forever</p>
  </li>
  <li>
  <a href="#"><img src="images/5.jpg"height="135px"/></a>
  <p>假面骑士build剧场版be the one</p>
  </li>
  </ul>
 </div>
 <div class="leftDiv3">
 <a href="#">查看更多</a>
 </div>
 </div>
 <div id="rightBody">
 <div class="rightDiv1">
 <h2>酷文</h2>
 <ul>
 <li>
 <h3><a href="#" target="_blank">我真是high到不行啊</a></h3>
 <p>好难做啊脑壳疼啊啊啊啊啊Wryyyyyyyyyyyyyyyyyyyyyyyyy.......</p>
 </li>
 <li>
 <h3><a href="#" target="_blank">承太郎先生快用你无敌的白金之星想想办法啊</a></h3>
 <p>好难做啊脑壳疼啊啊啊啊啊Wryyyyyyyyyyyyyyyyyyyyyyyyy.......</p>
 </li>
 <li>
 <h3><a href="#" target="_blank">你以为是JOJO,konoDIO哒!</a></h3>
 <p>好难做啊脑壳疼啊啊啊啊啊Wryyyyyyyyyyyyyyyyyyyyyyyyy.......</p>
 </li>
 </ul>
 <div class="rightDiv2">
 <dl class="dl1">
 <dt><a href="#">欧拉欧拉欧拉</a></dt>
 <dd>木大木大木大</dd>
 </dl>
 <dl class="dl2">
 <dt><a href="#">木大木大木大</a></dt>
 <dd>欧拉欧拉欧拉</dd>
 </dl>
 </div>
 </div>
</div>
</div>
</div>
<div id="footer">
<p class="p1">
<a href="#" target="_blank">首页</a>
<a href="#" target="_blank">美站</a>
<a href="#" target="_blank">酷文</a>
<a href="last" target="_blank">联系我们</a>
</p>
<p>
Copyright (c) 2014 | <a href="http://www.sifangku.com" target="_blank">私房库</a>
</p>
</div>
<script>
$(document).ready(function(){

  var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "be the one"
    ];
    $( "#dioText" ).autocomplete({
      source: availableTags
    });
	
	$("#dioButton").click(function(){
		$.ajax({url:"data/douban300.json",
				success:function(result){
			
				alert("Ajax数据访问成功");	
					
		}});
	});


	var msg="我是弹窗";
	var msg2="awsl";
	
  $("#dioButton").click(function(){
  var user;
  user=$("#dioText").val();
    alert(user);
  });
  
  
   $("#dioButton").click(function(){
    alert(msg2);
  });
	
	
});
</script>
</body>
</html>
















</html>